<template>
	<div>
		<clientListZ v-if="choseId==1" v-model:choseId="choseId" @sendRow="receiveRow"></clientListZ>
		<CustomDetail v-else-if="choseId==2" v-model:customData="customData"></CustomDetail>
		<CustomFollow v-else-if="choseId==3" v-model:customData="customData"></CustomFollow>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { Files } from '@element-plus/icons-vue';
import clientListZ from './ClientListZ.vue';
import CustomDetail from './subVue/CustomDetail.vue';
import CustomFollow from './subVue/CustomFollow.vue';

//通过父子传值来实现 组件的转换
const choseId = ref(1);
//定义传递到客户详细中的数据
const customData  = ref()
//接收子组件过来的数据
const receiveRow=(row)=>{
	console.log(row)
	customData.value=row
}
</script >
<style lang="less" scoped>
.handle-box {
	margin-bottom: 20px;   
}

.el-select {
	width: 200px;
	// margin-right: 10px;  
}

.handle-input {
	width: 130px;
    margin-right: 8px;
}
.label{
   display: inline-block;
   max-width:100%;
   margin-right: 2px;
   font-weight: 700; 
}

.top-btn{
	float: right;
	.el-button{
		margin-left: 3px;
        // height: 28px;
        width: 60px;
	}
}
.right-btn{
 	justify-content:center;
	.el-button{
		height: 22px;
		// width: 60px;
		margin-right: 10px;
		padding: 1px 5px;
	}
}

.demo-form-inline .el-input {
  --el-input-width: 220px;
}
.form-w{
	width: 220px;
}
</style>